// src/pages/Device/Create.tsx
import { Form, Input, Select, Button, message } from 'antd'
import { useMutation } from '@tanstack/react-query'
import { createDevice } from '@/api/device'
import type { CreateDeviceBody } from '@/api/device'

export default function CreateDevice() {
  const [form] = Form.useForm<CreateDeviceBody>()

  const { mutate, isPending } = useMutation({
    mutationFn: createDevice,                // 必须是 (vars) => Promise<DeviceItem>
    onSuccess: () => {
      message.success('设备创建成功')
      form.resetFields()
    },
  })

  return (
    <Form form={form} initialValues={{ characteristic: "string122",
      device_type_id: 2,
      is_group: 0,
      name: "string2",
      parent_device_id: null,
      x: 12,
      y: 2,
      z: 1 }} 
    onFinish={mutate} layout="vertical">
      <Form.Item label="characteristic" name="characteristic" rules={[{ required: true }]}>
        <Input placeholder="" />
      </Form.Item>
      <Form.Item label="device_type_id" name="device_type_id" rules={[{ required: true }]}>
        <Input placeholder="" />
      </Form.Item>
      <Form.Item label="is_group" name="is_group" rules={[{ required: true }]}>
        <Input placeholder="" />
      </Form.Item>
      <Form.Item label="name" name="name" rules={[{ required: true }]}>
        <Input placeholder="" />
      </Form.Item>
      <Form.Item label="parent_device_id" name="parent_device_id" >
        <Input placeholder="" />
      </Form.Item>
      <Form.Item label="x" name="x" rules={[{ required: true }]}>
        <Input placeholder="" />
      </Form.Item>
      <Form.Item label="y" name="y" rules={[{ required: true }]}>
        <Input placeholder="" />
      </Form.Item>
      <Form.Item label="z" name="z" rules={[{ required: true }]}>
        <Input placeholder="" />
      </Form.Item>
      <Button type="primary" htmlType="submit" loading={isPending}>
        保存
      </Button>
    </Form>
  )
}